<template>
  <SuperTable ref="superTableRef" search pager border align="center" header-title="盘点记录" :columns="columns" :data-request="fetchData" :export-config="{}" />
  <ViewDrawer v-model:show-drawer="state.showViewDrawer" :data="state.curData" />
</template>

<script setup lang="ts">
import type { VxeGridPropTypes } from 'vxe-table';
import type { TableColumnItem } from './columns';
import SuperTable from '@/framework/components/core/super-table/super-table.vue';
import ViewDrawer from '@/modules/sample-inventory/pages/inventory-records/components/view-drawer/view-drawer.vue';
import { message } from 'ant-design-vue';
import { baseColumns } from './columns';
import { reactive, ref } from 'vue';
import { delInventory, inventorySearch } from '@/modules/sample-inventory/api';
import router from '@/router';
import MQTT from '@/framework/utils/mqtt';

/**
 * mqtt
 */
MQTT.subscribe('bill-inventory-status', 0);
MQTT.$on('mqtt-msg', () => {
  console.log('盘点记录');
  refreshTableFn();
});

/**
 * data
 */
type State = {
  showViewDrawer: boolean;
  curData: any;
};
const state: State = reactive({
  showViewDrawer: false,
  curData: {},
});

/**
 * table
 */
const superTableRef = ref<InstanceType<typeof SuperTable>>();
const columns: TableColumnItem[] = [
  ...baseColumns,
  {
    title: '操作',
    field: '$action',
    hideInSearch: true,
    align: 'center',
    fixed: 'right',
    width: 200,
    actions: ({ row }) => [
      {
        label: '查看',
        onClick: () => {
          state.curData = row;
          state.showViewDrawer = true;
        },
      },
      {
        label: '编辑',
        disabled: row.status > 9,
        onClick: () => {
          router.push({
            name: 'inventoryCountDetail',
            params: {
              id: row.id,
            },
          });
        },
      },
      {
        label: '删除',
        disabled: row.status >= 3,
        popConfirm: {
          title: `确认删除该记录吗？`,
          onConfirm: async () => {
            await delInventory(row.id);
            message.success('操作成功！');
            refreshTableFn();
          },
        },
      },
    ],
  },
];
const fetchData = async (ori: VxeGridPropTypes.ProxyAjaxQueryParams) => {
  let data = superTableRef.value?.getFormModel();
  let params: any = {
    pageSize: ori.page.pageSize,
    pageNum: ori.page.currentPage,
    'orderBy[0].field': 'createTime',
    'orderBy[0].order': 'desc',
    status: data.status,
  };
  if (data.createTime) {
    params.createTimeBtw = data.createTime.join();
  }
  let res = await inventorySearch(params);
  return res.result;
};
const refreshTableFn = () => {
  superTableRef.value?.refreshTable();
};
</script>

<style scoped lang="less">
:deep(.icon) {
  margin: auto;
}
</style>
